<template>
  <div class="crumb">
    <span v-for="(item, index) in nav" :key="index">
      <span
        :style="{
          fontSize: index == nav.length - 1 ? '14px' : '16px',
          color: index != nav.length - 1 ? '#999' : '#333',
        }"
      >
        {{ item.name }}</span
      >
      <i v-show="index != nav.length - 1" style="margin: 0 5px">/</i>
    </span>
  </div>
</template>

<script>
export default {
  props: ["nav"],
  data() {
    return {};
  },
};
</script>
 
<style lang = "less" scoped>
.crumb {
  margin: 10px 0 30px;
}
</style>